<!doctype html>
<html> 
 <head> 
  <meta charset="UTF-8"> 
  <link rel="shortcut icon" href="/public_resource/wangzhan/web/public_resource/public/images/logo/m_logo_icon.png"> <!-- import CSS --> 
  <link rel="stylesheet" href="../../assets/theme/index.css"> <!--  --> 
  <link rel="stylesheet" href="../../styles/common.css"> 
  <link rel="stylesheet" href="./styles/index.css"> 
  <link rel="stylesheet" href="../../components/webHead/index.css"> 
  <link rel="stylesheet" href="../../components/webFoot/index.css"> 
  <link rel="stylesheet" href="../../components/listItem/index.css"> 
  <link rel="stylesheet" href="../../components/rightToolBar/index.css"> 
  <link rel="stylesheet" href="../../components/chatContainer/index.css"> 
  <link rel="stylesheet" href="../../lib/featureCarousel/feature-carousel.css"> 
  <link rel="stylesheet" href="../../lib/swiper-6.8.4/swiper-bundle.min.css"> 
  <link href="../../assets/img/favicon.ico" rel="shortcut icon" type="image/x-icon"> 
  <title>首页</title> 
  <script>
      window.busiType = "mall_home";
      window.busiId = "mall_home";
  </script> 
 </head> 
 <body> 
  <div id="app" class="wrapper" v-cloak> <web-head @search="searchData" @webhead_search_input="webhead_search_input" ref="webhead"></web-head> <!-- 广告位/轮播广告位 --> <!-- swiper-banner-start --> 
   <div class="swiper-banner" v-if="adList.length>0"> 
    <div class="swiper" id="swiper"> 
     <div class="swiper-wrapper"> <a :href="item.link" class="swiper-slide" v-for="(item, index) in adList" :key="index"> <img :src="item.cover" alt=""> </a> 
     </div> 
    </div> 
   </div> <!-- swiper-banner-end --> 
   <div class="container my-subscribe" style="flex-direction: column"> <!-- 我的订阅--> 
    <div v-if="subList.length" class="my-subscribe-content" style="padding-top: 17.5px;padding-bottom: 60px;"> 
     <div class="box_3 flex-col justify-end"> 
      <div class="section_55 flex-row justify-center "> 
       <div class="image-wrapper_2 flex-col"> 
        <img class="thumbnail_4" referrerpolicy="no-referrer" src="../../assets/img/home/sub-left.png"> 
       </div> 
       <div class="image-text_259 flex-row justify-between"> <span class="text-group_1">{{$t("mySubscription.title")}}</span> 
       </div> 
       <div class="image-wrapper_3 flex-col"> 
        <img class="thumbnail_5" referrerpolicy="no-referrer" src="../../assets/img/home/sub-right.png"> 
       </div> 
      </div> 
      <div class="box_76 flex-row justify-evenly" style="position: relative;"> 
       <div style="position: absolute;width: 100%;bottom: 0;background: rgba(192,200,209,0.5);"></div> 
       <div class="section_3 flex-col" v-for="item in subList" :key="item.productId" @click="toReadOnline(item)" :class="{'cursor-pointer':item.productCode}"> 
        <div class="image-wrapper_4 flex-col"> 
         <img class="image_7" referrerpolicy="no-referrer" :src="item.url"> 
         <div class="title-box flex-col" v-if="item.productName"> 
          <div class="title flex-row justify-center"> <span class="text" :title="item.productName">{{item.productName}}</span> 
          </div> 
          <div class="last flex-row justify-center"> <span class="text">{{$t("mySubscriptionData.latestReadable")}}：{{formatDate(item.recentDate)}}</span> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> <!--          <img class="image_10" referrerpolicy="no-referrer" src="../../assets/img/home/sub-down1.png" />--> <!--          <img class="image_11" referrerpolicy="no-referrer" src="../../assets/img/home/sub-down2.png" />--> 
     </div> 
    </div> 
   </div> 
   <div class="recommend-container" v-if="soleGoodsList &amp;&amp; soleGoodsList.length>0"> 
    <div class="container"> <!-- 主编推荐 --> 
     <div class="editor-recommend column-box"> 
      <div class="recommend-left"> <el-image class="recommend-title" src="../../assets/img/recommend-title.png"></el-image> 
       <div class="title">
        {{ $t("home.recommend") }}
       </div> <!-- <div class="subtitle">{{ $t("home.boutiqueRecommendationInfo") }}</div> --> 
       <div class="recommend-left-bottom" v-if="pageTotle>1"> 
        <div class="page">
         {{spage}}/{{pageTotle}}
        </div> 
        <div class="page-icon"> 
         <div class="left-page-icon" @click="reducePage"> <el-image src="../../assets/img/page-left-icon.svg"></el-image> 
         </div> 
         <div class="right-page-icon" @click="addPage"> <el-image src="../../assets/img/page-right-icon.svg"></el-image> 
         </div> 
        </div> 
       </div> 
      </div> 
      <div class="recommend-right"> 
       <div class="column-list" v-if="soleGoodsList &amp;&amp; soleGoodsList.length>0" v-loading="soleGoodsLoading"> 
        <template> 
         <div class="column-list-item-5" v-for="(item,index) in soleGoodsList" v-if="(index>=(spage-1)*3)&amp;&amp;(index<(spage)*3)" :key="index"> <list-item v-bind="item" @detail="getDetailData(item)" :is-sm="true"></list-item> 
         </div> 
         <div class="column-list-bottom"> 
          <div class="more-box"> <span @click="toCategory">{{ $t("home.seeMore") }}</span> <el-image src="../../assets/img/jiantou-sm.svg"></el-image> 
          </div> 
         </div> 
        </template> <!--              <template v-else-if="soleGoodsLoading">--> <!--                <div class="noData font-w">{{ $t("home.loading") }}</div>--> <!--              </template>--> <!--              <template v-else>--> <!--                <div class="noData">{{ $t("home.noProducts") }}</div>--> <!--              </template>--> 
       </div> 
      </div> 
     </div> 
    </div> 
   </div> 
   <div class="container" style="flex-direction: column"> 
    <div style="display: flex; padding-top: 60px;"> <!-- 独家特供 --> 
     <div class="container-left"> 
      <template v-if="cateList &amp;&amp; cateList.length>0"> 
       <template v-for="(item,index) in cateList"> 
        <div class="sole-supply column-box" :class="{'column-box-first': index === 0}" v-if="item.hotGoodsList &amp;&amp; item.hotGoodsList.length>0" :key="index"> 
         <div class="column-head"> 
          <div class="column-head-left"> <el-image :src="`../../assets/img/${item.code}.svg`"> 
            <template slot="error"> <el-image :src="`../../assets/img/defult.svg`"></el-image> 
            </template> 
           </el-image> <product-category-name :product-category="item"></product-category-name> 
          </div> 
          <div class="more-box"> <span @click="toCategory(item)">{{ $t("home.seeMore") }}</span> <el-image src="../../assets/img/jiantou-sm.svg"></el-image> 
          </div> 
         </div> 
         <div class="column-list" v-loading="item.hotGoodsLoading"> 
          <template v-for="(goodsItem,goodsIndex) in item.hotGoodsList"> 
           <div class="column-list-item-4" v-if="goodsIndex < 3" :key="goodsIndex"> <list-item v-bind="goodsItem" :goodsitem="goodsItem" @detail="getDetailData(goodsItem)"></list-item> 
           </div> 
          </template> <!--                <template v-else-if="item.hotGoodsLoading">--> <!--                  <div class="noData font-w">{{ $t("home.loading") }}</div>--> <!--                </template>--> <!--                <template v-else>--> <!--                  <div class="noData">{{ $t("home.noProducts") }}</div>--> <!--                </template>--> 
         </div> 
        </div> 
       </template> 
      </template> 
     </div> 
     <div class="container-right"> 
      <div class="sidebar-sticky"> 
       <div class="right-title"> <el-image src="../../assets/img/laba.svg"></el-image><span>{{ $t("home.promotionalAdvertisement") }}</span> 
       </div> <a :href="item.link" class="right-ad-box" v-for="(item,index) in adList2" :key="index"> 
        <el-image :src="item.cover"></el-image> </a> 
       <div class="right-ad-box"> <el-image src="../../assets/img/wx-ad.png"></el-image> 
       </div> 
      </div> 
     </div> <!-- 单个广告位 --> <!-- <div class="carousel-box column-box">
          <el-image src="../../assets/img/banner-sm.png"> </el-image>
        </div> --> <!-- 全部商品 --> <!-- <div class="product-list column-box" id="allProducrt">
          <column-head img="../../assets/img/home/column_icon3.png" color="#A38463" :right="true">
            <div class="right-select">
              <el-select v-model="selectValue" placeholder="请选择" @change="handleAllGoodsCateChange">
                <el-option label="全部分类" value="all"> </el-option>
                <el-option v-for="(item,index) in cateList" :key="index" :label="item.name" :value="item.id">
                </el-option>
              </el-select>
            </div>
            <div class="right-date">
              <el-input placeholder="请输入搜索内容" v-model="search" @input="handleSearchInput"
                @keyup.enter.native="handleSearch()">
                <i slot="prefix" class="el-input__icon el-icon-search"></i>
              </el-input>
            </div>
          </column-head>
          <div class="column-list" v-infinite-scroll="loadMore" infinite-scroll-disabled="busy"
            infinite-scroll-distance="10" v-loading="goodsLoading">
            <template v-if="goodsList && goodsList.length>0">
              <div class="column-list-item-4" v-for="(item,index) in goodsList" :key="index">
                <list-item v-bind="item" @detail="getDetailData(item)"></list-item>
              </div>
            </template>
            <template v-else-if="goodsLoading">
              <div class="noData font-w">正在加载</div>
            </template>
            <template v-else>
              <div class="noData">暂无商品</div>
            </template>
          </div>
        </div> --> 
    </div> 
   </div> <!-- 工具栏 --> <right-tool-bar></right-tool-bar> <!-- footer --> <web-foot></web-foot> 
  </div> <!-- import Vue before Element --> <!--     <script src="../../lib/vue/vue.js"></script>--> 
  <script src="../../lib/vue/vue.min.js"></script> 
  <script src="../../utils/xss-filters.js"></script> <!-- import JavaScript --> 
  <script src="../../lib/element-ui/js/index.js"></script> 
  <script src="../../lib/moment.js/2.29.4/moment.min.js"></script> 
  <script src="../../lib/moment.js/2.29.4/locale/zh-cn.min.js"></script> 
  <script src="../../lib/uri/URI.min.js"></script> 
  <script src="../../lib/vue-infinite-scroll/vue-infinite-scroll.js"></script> 
  <script src="../../lib/axios/axios.min.js"></script> 
  <script src="../../lib/lodash/lodash.min.js"></script> 
  <script src="../../lib/mathjs/11.3.3/math.min.js"></script> 
  <script src="../../lib/numeral.js/2.0.6/numeral.min.js"></script> 
  <script src="../../lib/numeral.js/2.0.6/locales/chs.min.js"></script> 
  <script src="../../lib/popmotion/popmotion.min.js"></script> 
  <script src="../../lib/jquery/3.6/jquery-3.6.0.min.js"></script> 
  <script src="../../lib/jquery/3.6/jquery-migrate-1.4.1.min.js"></script> 
  <script src="../../lib/featureCarousel/jquery.featureCarousel.min.js"></script> 
  <script src="../../lib/vue-i18n/vue-i18n.min.js"></script> 
  <script src="../../lib/vue-i18n/languagePack.js"></script> 
  <script src="../../lib/swiper-6.8.4/swiper-bundle.min.js"></script> 
  <script src="../../lib/@ty/config_center/2.1.3/ConfigCenter.umd.min.js"></script> 
  <script src="../../lib/@ty/service_util/2.1.1/service_util.umd.min.js"></script> 
  <script src="../../lib/@ty/talk_about_manager/talk_about.umd.js?v=1.2"></script> 
  <script src="../../utils/common.js"></script> 
  <script src="../../utils/crypto-js.js"></script> 
  <script src="../../utils/ase.js"></script> 
  <script src="../../utils/encryption_data.min.js"></script> 
  <script src="../../utils/uri.js"></script> 
  <script src="../../utils/request.js"></script> 
  <script src="../../api/common.js"></script> 
  <script src="../../api/product.js"></script> 
  <script src="../../api/cart.js"></script> <!--  --> 
  <script src="./components/columnHead/index.js"></script> 
  <script src="../../components/listItem/index.js"></script> 
  <script src="../../components/webHead/index.js"></script> 
  <script src="../../components/webFoot/index.js"></script> 
  <script src="../../components/rightToolBar/index.js"></script> 
  <script src="../../components/chatContainer/index.js"></script> 
  <script>
    const { startsWith, orderBy } = _;
    Vue.config.devtools = true;
    Vue.config.errorHandler = function (err, vm, info) {
      console.error(err);
      if (err && err.message) {
        vm.$message.error(err.message);
      }
    };
   new Vue({
      i18n: i18n(),
      el: "#app",
      name: "home",
      directives: { infiniteScroll },
      data: function () {
        return {
          subList: [],
          soleProIds: ["2", "35", "36", "37", "21"],
          adList: [],
          adList2: [],
          tabsSelect: 0,
          tabsSelectId: "",
          tabsList: [
            { name: this.$t('home.periodicals') }, // 期刊
            { name: this.$t('home.books') }, // 图书
            { name: this.$t('home.researchReport') }, // 研究报告
            { name: this.$t('home.internalInformationCustomization') }, // 内部信息定制
            { name: this.$t('home.culturalAndCreativeProducts') }, // 文创商品
          ],
          selectValue: "all",
          dateValue: "",
          textValue01: {
            title: "《领导决策信息》2022订阅每周寄送电子刊免费发送",
            imgUrl: "../../assets/img/home/cover02.png",
            url: "",
            price: "495.00",
            sales: "233",
            showNew: false,
          },
          textValue02: {
            title: "《2019年中国重点城市大数据发展指数分析报告》PDF电子板",
            imgUrl: "../../assets/img/home/cover01.png",
            url: "",
            price: "48.90",
            sales: "199",
            showNew: false,
          },
          page: 0,
          size: 24,
          busy: false,
          goodsList: [],
          hotGoodsList: [],
          soleGoodsList: [],
          salesList: [],
          imgList: [],
          DOWN_LOAD: "/tycom_api/static/file/",
          cateList: [],
          soleGoodsLoading: true,
          hotGoodsLoading: true,
          goodsLoading: true,
          search: "",
          resizeFlag: null,
          pageTotle: 0,
          spage: 0,
          i18nOptions: null,
          bannerOpacity: 0,
          adListName:["home_broadside","home_top_swiper"],
          adListObj:[[],[]],
          adPath: '/busi_static',
        };
      },
      async mounted() {
        try {
          await this.getAdList();
        } catch (error) {}
        this.initFeatureCarousel();
        this.handleUrlSearch();
        await this._getSalesList();
        await this.getSoleProducts();
        await this.getProductCategory();
        // await this.getHotProducts();
        this.isQuery();
        // window.onresize = () => {
        //   clearTimeout(this.resizeFlag);
        //   this.resizeFlag = setTimeout(() => {
        //     this.initFeatureCarousel();
        //   }, 100)
        // };
      },
      watch: {
        async search(newVal) {
          if (newVal === "") {
            this.page = 1;
            this.goodsList = [];
            await this.getProducts();
          }
        },
        '$i18n.locale': {
          immediate:true,
          handler(){
            this.setI18nOptions()
          }
        }
      },
      methods: {
        getBgCover(item){
          return _.get(item,)
        },
        async getAdList(){
          // 获取首页侧边栏目推广
          const homeBroadside = this.adListName[0];
          let adListJson01 = [];
          try {
            const uri = URI.joinPaths(this.adPath, `/gg/${homeBroadside}.json`);
            const adJson = uri.toString();
            const homeBroadsideJson = await this.getAdJson(adJson);
            adListJson01 = homeBroadsideJson.ggList || [];
          } catch (error) {}
          if(adListJson01.length>0){
            adListJson01 = adListJson01.map(item=>{
              const uri = URI.joinPaths(this.adPath, item);
              return uri.toString();
            })
          }
          this.adListObj[0] = await this.getAdlistByJson(adListJson01);
          this.adListObj[0] = this.adListObj[0].filter(item=>{
            return item && item.status === 1;
          })
          this.adList2 = [];
          this.adListObj[0].map(item=>{
            const titleFileArray = _.get(item, "titleImage.fileArray", []);
            const contentFileArray = _.get(item, "contentImage.fileArray", []);
            if(titleFileArray.length){
              titleFileArray.map(fileItem=>{
                let link = item.link;
                if(contentFileArray.length > 0){
                  link = '/views/ad-detail/index.html?json='+item.json;
                }
                const uri = URI.joinPaths(this.adPath, fileItem);
                const coverPath = uri.toString();
                this.adList2.push({
                  link:link || "javascript:;",
                  cover: coverPath
                })
              })
            }
          })
          // 获取首页轮播的广告位数据
          const homeTopSwiper = this.adListName[1];
          let adListJson02 = [];
          try {
            const uri = URI.joinPaths(this.adPath, `/gg/${homeTopSwiper}.json`);
            const adJson = uri.toString();
            const homeTopSwiperJson = await this.getAdJson(adJson);
            adListJson02 = homeTopSwiperJson.ggList;
          } catch (error) {}
          if(adListJson02.length>0){
            adListJson02 = adListJson02.map(item=>{
              const uri = URI.joinPaths(this.adPath, item);
              return uri.toString();
            })
          }
          this.adListObj[1] = await this.getAdlistByJson(adListJson02);
          this.adListObj[1] = this.adListObj[1].filter(item=>{
            return item && item.status === 1;
          })
          // 
          this.adList = [];
          this.adListObj[1].map(item => {
            const fileArray = _.get(item, "titleImage.fileArray", []);
            const contentFileArray = _.get(item, "contentImage.fileArray", []);
            let link = item.link;
            if(fileArray.length){
              fileArray.map(fileItem=>{
                const uri = URI.joinPaths(this.adPath, fileItem);
                if(contentFileArray.length > 0){
                  link = '/views/ad-detail/index.html?json='+item.json;
                }
                this.adList.push({
                  link:link || "javascript:;",
                  cover:uri.toString()
                })
              })
            }
          })
        },
        async getAdJson(jsonName){
          const randomNum = _.random(10000000000000, 99999999999999);
          if(jsonName.indexOf("?")<0){
            jsonName+=('?v='+randomNum);
          }
          return new Promise(function(o, v) {
            axios.get(jsonName).then((data)=>{
              if(data.data){
                data.data = {...data.data,json:jsonName};
                o(data.data);
              }else{
                o({});
              }
            }).catch(e=>{
              console.error(e);
              v(null)
            })
          })
        },
        async getAdlistByJson(jsonList){
          const promiseList = [];
          jsonList.map(item=>{
            promiseList.push(this.getAdJson(item));
          })
          return Promise.all(promiseList);
        },
        toReadOnline(row) {
          const uri = URI("/reader/Home/Index.html").origin(location.href);
          const productCode = _.get(row, "productCode");
          if (productCode) {
            uri.addQuery("productCode", productCode);
            window.open(uri.toString(), "_blank");
          }
        },
        formatDate(date) {
          if (!date) return null;
          date = moment(date);
          return date.isValid() ? date.format("YYYY/MM/DD") : null;
        },
        setI18nOptions() {
          this.tabsList = [
            { name: this.$t('home.periodicals') }, // 期刊
            { name: this.$t('home.books') }, // 图书
            { name: this.$t('home.researchReport') }, // 研究报告
            { name: this.$t('home.internalInformationCustomization') }, // 内部信息定制
            { name: this.$t('home.culturalAndCreativeProducts') }, // 文创商品
            { name: this.$t('home.culturalAndCreativeProducts') }, // 文创商品
          ]
          const titltDom = document.querySelector?.('title');
          titltDom && (titltDom.innerText = this.$t('home.title'))
        },
        addPage() {
          if (this.spage < this.pageTotle) {
            this.spage++
          }
        },
        reducePage() {
          if (this.spage > 1) {
            this.spage--
          }
        },
        async initFeatureCarousel() {
          await this.$nextTick()
          const mySwiper = new Swiper('#swiper', {
            autoplay: {
              delay: 3000, // 轮播时长
              disableOnInteraction: false, // 用户操作swiper之后，是否禁止autoplay
            },
            effect: 'fade',
            slideToClickedSlide: true, // 设置为true则点击slide会过渡到这个slide。
            loop: true, // 开启循环
            speed: 500, // 切换速度
            centeredSlides: true, // 居中
            slidesPerView: 3, // 窗口展示数量
            effect: "coverflow", // 切换效果
            coverflowEffect: {
              rotate: 0,
              stretch: '70%',
              depth: 160,
              modifier: 1,
              slideShadows: true
            },
            // 监听
            on: {
              slideChange: function () {
                // 淡入淡出
                const length = this.slides.length - 1
                const nextIndex = this.activeIndex + 1 > length ? 0 : this.activeIndex + 1
                const prevIndex = this.activeIndex - 1 < 0 ? length : this.activeIndex - 1
                const arr = [nextIndex, prevIndex, this.activeIndex]
                for (let i = 0; i < this.slides.length; i++) {
                  const dom = this.slides[i]
                  if (arr.includes(i)) {
                    dom.classList.remove("swiperBannerHidden")
                  } else {
                    dom.classList.add("swiperBannerHidden")
                  }
                }
              },
            },
          })

        },
        async loadMore() {
          this.busy = true;
          this.page++;
          await this.getProducts();
        },
        handleTabClick(item, index) {
          this.tabsSelect = index;
          this.tabsSelectId = item.id;
          // this.getHotProducts();
        },
        async getProducts() {
          const params = {
            page: this.page,
            size: this.size,
            where: {
              $and: [],
              name: { $like: `%${this.search}%` },
              pubStatus: {
                $in: [1,2]
              }
            },
            includeFile: true,
            include: [
              {
                model: "product_model",
                order: [["order", "asc"]],
                attributes: ["price", "salesVolume"],
                include: [
                  {
                    model: "productModelInventory",
                  },
                ],
              },
            ],
            order: [
              ["order", "asc"],
              ["createdAt", "asc"],
            ],
          };
          if (this.dateValue) {
            params.where.$and.push({
              createdAt: this.dateValue,
            });
          }
          if (this.selectValue && this.selectValue !== "all") {
            params.where.$and.push({
              productCategoryId: this.selectValue,
            });
          }
          try {
            this.goodsLoading = true;
            const res = await getProductByPage(params);
            if (res.data && res.data.rows) {
              const data = res.data.rows;
              this.setProductInfo(data);
              this.goodsList = [...this.goodsList, ...data];
              if (res.data.rows.length >= 24) {
                this.busy = false;
              }
            }
            this.goodsLoading = false;
          } catch (e) {
            console.error(e);
            this.goodsLoading = false;
          }
        },
        async getSoleProducts() {
          this.soleGoodsLoading = true;
          try {
            const productAryResult = await getProductsByCode({
              "code": "BoutiqueRecommendation",
              "where": {
                "pub_status": 1
              },
              "include": [
                {
                  "model": "product_model",
                  "order": [
                    [
                      "order",
                      "asc"
                    ]
                  ],
                  "attributes": [
                    "price"
                  ],
                  "include": [
                    {
                      "model": "productModelInventory"
                    }
                  ]
                }
              ],
              "includeFile": true,
              "limit": 3
            });
            const data = productAryResult.data || []
            this.setProductInfo(data);
            this.soleGoodsList = data;
            this.pageTotle = Math.ceil(data.length / 3)
            this.spage = 1
            this.soleGoodsLoading = false;
          } catch (e) {
            console.error(e);
            this.soleGoodsLoading = false;
          }
        },
        async getHotProducts(item) {
          this.$set(item, 'hotGoodsLoading', true);
          const params = {
            page: 1,
            size: 24,
            rootProductCategoryId: Number(item.id) || undefined,
            where: {
              $and: [
                {
                  // productCategoryId: item.id,
                },
              ],
              pubStatus: {
                $in: [1,2]
              }
            },
            include: [
              {
                model: "product_model",
                order: [["order", "asc"]],
                attributes: ["price", "salesVolume"],
                include: [
                  {
                    model: "productModelInventory",
                  },
                ],
              },
            ],
            includeFile: true,
            order: [
              ["order", "asc"],
              ["createdAt", "asc"],
            ],
          };
          if (this.dateValue) {
            params.where.$and.push({
              createdAt: this.dateValue,
            });
          }
          try {
            const res = await getProductByPage(params);
            if (res.data && res.data.rows) {
              const data = res.data.rows;
              this.setProductInfo(data);
              this.$set(item, 'hotGoodsList', data);
            }
            this.$set(item, 'hotGoodsLoading', false);
            item.hotGoodsLoading = false;
          } catch (e) {
            console.error(e);
            this.$set(item, 'hotGoodsList', []);
            this.$set(item, 'hotGoodsLoading', false);
          }
        },
        async getProductCategory() {
          const res = await productCategory({
            where: {
              $and: [{
                "parentId": null,
              }]
            },
            hasPubProduct: 1
          });
          if (res && res.data) {
            let cateList = res.data;
            cateList = _.sortBy(cateList, ['order']);
            this.cateList = cateList.filter(item => {
              const products = _.get(item, "products", []);
              return products.length > 0;
            });
            if (res.data.length > 0) {
              this.tabsSelectId = this.cateList[0].id;
              for (const item of this.cateList) {
                await this.getHotProducts(item)
              }
            }
          }
        },
        _getSalesList() {
          return new Promise(async (resolve, reject) => {
            try {
              const res = await getSalesList({ where: { pubStatus: {
                  $in: [1,2]
                } } });
              const data = res.data;
              this.salesList = data;
              resolve();
            } catch (e) {
              console.error(e);
              reject();
            }
          });
        },
        setProductInfo(goods) {
          goods.forEach((item) => {
            item.title = item.name;
            item.url = `/apps/mall/views/detail/index.html?id=${item.id}`;
            if (item.fileResources && item.fileResources.length > 0) {
              const titleImg = orderBy(
                item.fileResources,
                ["info.name"],
                ["asc"]
              ).find((item) => startsWith(item.info.resourceType, "标题图"));
              if (titleImg) {
                item.imgUrl = this.getImgUrl(titleImg.info.url);
              }
            }
          });
          this.salesList.forEach((s) => {
            goods.forEach((v) => {
              if (v.productModels && v.productModels.length > 0) {
                if (s.id === v.productModels[0].id) {
                  v.sales =
                    (s.productModelInventory &&
                      s.productModelInventory.sell) ||
                    0;
                  v.price =
                    (s.productModelInventory &&
                      s.productModelInventory.tagPrice) ||
                    0;
                }
              } else {
                v.sales = 0;
                v.price = 0;
              }
            });
          });
        },
        getDetailData(item) {
          const id = item.id;
          const productCategoryId = item.productCategoryId;
          window.open(
            `/apps/mall/views/detail/index.html?id=${id}&productCategoryId=${productCategoryId}`
          );
        },
        handleAllGoodsCateChange(val) {
          this.selectValue = val;
          this.page = 1;
          this.goodsList = [];
          this.getProducts();
        },
        handleDateChange(val) {
          this.dateValue = val;
          this.page = 1;
          this.goodsList = [];
          this.getProducts();
        },
        getImgUrl(imgUrl) {
          if (!imgUrl) return "";
          const uri = joinPathObj(this.DOWN_LOAD, imgUrl);
          return uri.toString();
        },
        // 主搜索框
        async searchData(data) {
          const search = data.search;
          this.search = search;
          this.page = 1;
          this.goodsList = [];
          await this.getProducts();
          await this.$nextTick();
          this.handleRoll("allProducrt");
        },
        // 全部商品搜索框
        async handleSearch() {
          this.page = 1;
          this.goodsList = [];
          await this.getProducts();
        },
        // 获取Query
        handleUrlSearch() {
          const data = URI(window.location.href).query(true);
          const query = data.query;
          if (query) {
            this.search = query;
            this.$refs["webhead"].handleSearchIcon();
            this.$refs["webhead"].handleSetSearch({ search: this.search });
          }
        },
        // 是否有query
        isQuery() {
          if (this.search) {
            this.handleRoll("allProducrt");
          }
        },
        // 滚动
        handleRoll(dom) {
          const scrollY = window.scrollY;
          const offsetTop = document.getElementById(dom).offsetTop;
          popmotion.animate({
            from: scrollY, // 当前的位置
            to: offsetTop, // 目标位置
            onUpdate: (latest) => {
              return window.scrollTo(0, latest);
            },
          });
        },
        // 搜索框数据同步
        webhead_search_input(data) {
          this.search = data.search;
        },
        // 搜索框数据同步
        handleSearchInput() {
          this.$refs["webhead"].handleSetSearch({ search: this.search });
        },
        toCategory(row) {
          let uri = new URI('/apps/mall/views/category/index.html');
          let categoryPath = uri.toString();
          if (row) {
            const id = row.id
            categoryPath = uri.setSearch('id', id).toString();
          }
          window.open(categoryPath, '_blank')
        },
        async refreshSub() {
          const resp = await queryUserSubscribe().catch(e => console.error(e))
          let subList = _.get(resp, 'data') || []
          subList.forEach(item => {
            if (item.pageImageUrl) {
              item.url = this.getImgUrl(item.pageImageUrl)
            }
          })
          // subList=_.slice(subList,0,2)
          const maxSubCount = 4
          subList = _.slice(subList, 0, maxSubCount)
          subList = _.orderBy(subList, ['recentDate'], ['desc'])
          if (subList.length && subList.length < maxSubCount) {
            //   不足4个，补充到4个，并且是默认图
            const defaultSubList = _.fill(Array(maxSubCount), {
              url: "../../assets/img/home/sub_default.png"
            })
            subList = _.merge([], defaultSubList, subList)
          }
          this.subList = subList
          // this.subList=_.orderBy(subList,['recentDate'],['desc'])
        }
      },
      async created() {
        await this.refreshSub()
      }
    });
  </script>  
 </body>
</html>